/**
 * @author xuzj
 */
/**
 * 日期时间字段
 */
CQCIS.form.DateTimeField = Ext.extend(Ext.form.DateField, {
    format: "Y-m-d H:i:s",
    readOnly: true,
    clearTime: true,
    defaultAutoCreate: {
        tag: "input",
        type: "text",
        size: "16",
        autocomplete: "off"
    },
    onTriggerClick: function() {
        if (this.disabled) {
            return;
        }
        if (!this.menu) {
            this.menu = new Ext.menu.DateMenu();
        }
        Ext.apply(this.menu.picker, {
            clearTime: this.clearTime,
            minDate: this.minValue,
            maxDate: this.maxValue,
            disabledDatesRE: this.ddMatch,
            disabledDatesText: this.disabledDatesText,
            disabledDays: this.disabledDays,
            disabledDaysText: this.disabledDaysText,
            format: this.format,
            minText: String.format(this.minText, this.formatDate(this.minValue)),
            maxText: String.format(this.maxText, this.formatDate(this.maxValue)),
            setValue: function(value) {
                var old = this.value;
                this.value = value;
                if (this.el) {
                    this.update(this.value);
                }
            },
            updateTime: function() {
				var now = new Date();
                if (this.clearTime) {
                    this.hourField.child("option", true).selected = true;
                    this.minuField.child("option", true).selected = true;
                    this.secoField.child("option", true).selected = true;
                } else {
                    this.hourField.child("option[value=" + new Number(now.format("H")) + "]", true).selected = true;
                    this.minuField.child("option[value=" + new Number(now.format("i")) + "]", true).selected = true;
                    this.secoField.child("option[value=" + new Number(now.format("s")) + "]", true).selected = true;
                }
            },
            selectToday: function() {
                this.setValue(new Date());
                this.fireEvent("select", this, this.value);
            },
            onRender: function(container, position) {
                var m = ['<table cellspacing="0">', '<tr><td class="x-date-left"><a href="javascript:void();" title="', this.prevText, '" id="', Ext.id(), '">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="javascript:void();" title="', this.nextText, '" id="', Ext.id(), '">&#160;</a></td></tr>', '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'];
                var dn = this.dayNames;
                for (var i = 0; i < 7; i++) {
                    var d = this.startDay + i;
                    if (d > 6) {
                        d = d - 7;
                    }
                    m.push("<th><span>", dn[d].substr(0, 1), "</span></th>");
                }
                m[m.length] = "</tr></thead><tbody><tr>";
                for (var i = 0; i < 42; i++) {
                    if (i % 7 == 0 && i != 0) {
                        m[m.length] = "</tr><tr>";
                    }
                    m[m.length] = '<td><a href="javascript:void();" hidefocus="on" class="x-date-date" tabIndex="1" id="' + Ext.id() + '"><em><span></span></em></a></td>';
                }
                m.push('</tr></tbody></table></td></tr>', '<tr><td colspan="3" class="x-date-bottom-time" align="center"></td></tr>', '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>', '</table><div class="x-date-mp"></div>');
                
                var el = document.createElement("div");
                el.className = "x-date-picker";
                el.innerHTML = m.join("");
                
                container.dom.insertBefore(el, position);
                
                this.el = Ext.get(el);
                this.eventEl = Ext.get(el.firstChild);
                
                new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"), {
                    handler: this.showPrevMonth,
                    scope: this,
                    preventDefault: true,
                    stopDefault: true
                });
                
                new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"), {
                    handler: this.showNextMonth,
                    scope: this,
                    preventDefault: true,
                    stopDefault: true
                });
                
                this.eventEl.on("mousewheel", this.handleMouseWheel, this);
                
                this.monthPicker = this.el.down('div.x-date-mp');
                this.monthPicker.enableDisplayMode('block');
                
                var kn = new Ext.KeyNav(this.eventEl, {
                    "left": function(e) {
                        e.ctrlKey ? this.showPrevMonth() : this.update(this.activeDate.add("d", -1));
                    },
                    
                    "right": function(e) {
                        e.ctrlKey ? this.showNextMonth() : this.update(this.activeDate.add("d", 1));
                    },
                    
                    "up": function(e) {
                        e.ctrlKey ? this.showNextYear() : this.update(this.activeDate.add("d", -7));
                    },
                    
                    "down": function(e) {
                        e.ctrlKey ? this.showPrevYear() : this.update(this.activeDate.add("d", 7));
                    },
                    
                    "pageUp": function(e) {
                        this.showNextMonth();
                    },
                    
                    "pageDown": function(e) {
                        this.showPrevMonth();
                    },
                    
                    "enter": function(e) {
                        e.stopPropagation();
                        return true;
                    },
                    
                    scope: this
                });
                
                this.eventEl.on("click", this.handleDateClick, this, {
                    stopEvent: true,
                    delegate: "a.x-date-date"
                });
                
                this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday, this);
                
                this.el.unselectable();
                
                this.cells = this.el.select("table.x-date-inner tbody td");
                this.textNodes = this.el.query("table.x-date-inner tbody span");
                
                this.mbtn = new Ext.Button({
                    text: "&#160;",
                    tooltip: this.monthYearText,
                    renderTo: this.el.child("td.x-date-middle", true)
                });
                
                this.mbtn.on('click', this.showMonthPicker, this);
                this.mbtn.el.child(this.mbtn.menuClassTarget).addClass("x-btn-with-menu");
                
                var today = (new Date()).dateFormat(this.format);
                this.todayBtn = new Ext.Button({
                    renderTo: this.el.child("td.x-date-bottom", true),
                    text: String.format(this.todayText, today),
                    tooltip: String.format(this.todayTip, today),
                    handler: this.selectToday,
                    scope: this
                });
                this.timeSelect();
                
                if (Ext.isIE) {
                    this.el.repaint();
                }
                this.update(this.value);
            },
            timeSelect: function() {
                var hourNum = [], timeNum = [], now = new Date();
                for (var i = 0; i < 60; i++) {
                    if (i < 10) {
                        if (i < 24) {
                            hourNum.push('<option value="' + i + '">0' + i + '</option>');
                        }
                        timeNum.push('<option value="' + i + '">0' + i + '</option>');
                    } else {
                        if (i < 24) {
                            hourNum.push('<option value="' + i + '">' + i + '</option>');
                        }
                        timeNum.push('<option value="' + i + '">' + i + '</option>');
                    }
                }
                
                Ext.DomHelper.append(this.el.child("td.x-date-bottom-time"), {
                    tag: 'span',
                    id: 'time-select-div',
                    children: [{
                        tag: 'select',
                        cls: 'select-hour',
                        children: hourNum
                    }, {
                        tag: 'span',
                        html: '：'
                    }, {
                        tag: 'select',
                        cls: 'select-minu',
                        children: timeNum
                    }, {
                        tag: 'span',
                        html: '：'
                    }, {
                        tag: 'select',
                        cls: 'select-second',
                        children: timeNum
                    }]
                });
                this.hourField = this.el.child("td.x-date-bottom-time select.select-hour");
                this.minuField = this.el.child("td.x-date-bottom-time select.select-minu");
                this.secoField = this.el.child("td.x-date-bottom-time select.select-second");
                this.hourField.show();
                this.minuField.show();
                this.secoField.show();
            },
            handleDateClick: function(e, t) {
                //alert(t.id)
                e.stopEvent();
                if (t.dateValue && !Ext.fly(t.parentNode).hasClass("x-date-disabled")) {
                    var hour = this.hourField.getValue(true);
                    var minu = this.minuField.getValue(true);
                    var seco = this.secoField.getValue(true);
                    this.setValue(new Date(new Number(t.dateValue) + hour * 60 * 60 * 1000 + minu * 60 * 1000 + seco * 1000));
                    this.fireEvent("select", this, this.value);
                }
            },
            hideMonthPicker: function(disableAnim) {
                if (this.monthPicker) {
                    if (disableAnim === true) {
                        this.monthPicker.hide();
                    } else {
                        this.monthPicker.slideOut('t', {
                            duration: 0.2
                        });
                    }
                    this.el.child("td.x-date-bottom-time").show();
                    this.hourField.show();
                    this.minuField.show();
                    this.secoField.show();
                }
            },
            showMonthPicker: function() {
                this.createMonthPicker();
                var size = this.el.getSize();
                this.monthPicker.setSize(size);
                this.monthPicker.child('table').setSize(size);
                
                this.mpSelMonth = (this.activeDate || this.value).getMonth();
                this.updateMPMonth(this.mpSelMonth);
                this.mpSelYear = (this.activeDate || this.value).getFullYear();
                this.updateMPYear(this.mpSelYear);
                
                this.monthPicker.slideIn('t', {
                    duration: 0.2
                });
                this.el.child("td.x-date-bottom-time").hide();
                this.hourField.hide();
                this.minuField.hide();
                this.secoField.hide();
            }
        });
        this.menu.on(Ext.apply({}, this.menuListeners, {
            scope: this
        }));
        this.menu.picker.setValue(this.getValue() || new Date());
        this.menu.show(this.el, "tl-bl?");
        this.menu.picker.updateTime();
    }
});
Ext.reg('datetimefield', CQCIS.form.DateTimeField);
